<template>
  <div class="container clearfix">
    <div class="header">
      <img :src="base_url+'/wode/shimingrenzheng/shimingrenzheng--beijing@2x.png'"
           v-if="base_url"
           alt
           class="image" />
    </div>
    <div class="list">
      <div class="item"
           @tap="to_normal()">
        <a class="clearfix">
          普通用户认证
          <div class="icon"
               v-if="identification_normal!='已认证'">
            <img :src="base_url+'/jifenshangcheng/xiangqingye/xiayibu@2x.png'"
                 v-if="base_url"
                 alt=""
                 class="img">
          </div>
          <div class="status"
               :style="identification_normal=='已认证'?'margin-right:15px':''">{{identification_normal}}</div>
          <!-- <img :src="base_url+'/jifenshangcheng/xiangqingye/xiayibu@2x.png'"
                 v-if="base_url"
                 alt=""
                 class="img"> -->
        </a>
      </div>
      <div class="item item1"
           v-if="(identity_type == 4 && auth1 == 1) ||(identity_type!== 4 && auth3 == 1)"
           @tap="to_normal()">
        <a class="clearfix clearfix1">
          证件类型
          <!-- <div class="icon">
            <img :src="base_url+'/jifenshangcheng/xiangqingye/xiayibu@2x.png'"
                 v-if="base_url"
                 alt=""
                 class="img">
          </div>-->
          <div class="status gray">{{identity_type}}</div>
        </a>
      </div>
      <div class="item item1"
           v-if="(identity_type == 4 && auth1 == 1) ||(identity_type!== 4 && auth3 == 1)"
           @tap="to_normal()">
        <a class="clearfix clearfix1">
          证件号码
          <!-- <div class="icon">
            <img :src="base_url+'/jifenshangcheng/xiangqingye/xiayibu@2x.png'"
                 v-if="base_url"
                 alt=""
                 class="img">
          </div>-->
          <div class="status gray">{{identity}}</div>
        </a>
      </div>
    </div>
    <div class="tip">
      <p class="tip1">* 用户认证后支持购买商城商品、预约医美项目、部分金币提现</p>
      <p class="tip2">【美亿齿】温馨提示：</p>
      <p class="tip3">Q：我在购买跨境商品时，为什么需要提供身份证信息？</p>
      <p class="tip4">A：您购买的商品属于跨境商品，送到您手中需要经过海关报关流程。</p>
      <p class="tip5">根据国家法规规定：港澳台及国外商品进入中国大陆，需客户提供身份信息以完成报关。</p>
      <p class="tip6">如果您不上传或者不及时上传的您的清关材料，可能会导致海关检查扣留您的货物，为了保障您的货物尽早送达到您手中，建议您及时上传清关材料，感谢您的配合～</p>
    </div>
  </div>
</template>
<script>
import common from "@/assets/js/mmk_common.js";
export default {
  data () {
    return {
      identification_normal: "",
      identification_special: "",
      base_url: common.image_resource,
      auth1: "",
      auth3: "",
      identity_type: "",
      identity: ""
    };
  },
  methods: {
    getData () {
      wx.showLoading({
        title: "加载中", //提示的内容,
        mask: true //显示透明蒙层，防止触摸穿透,
      });
      common.fly_post("/api/v4_5/my_identiy", {}, result => {
        let res = result.data;
        wx.hideLoading();
        if (res.status_code == 0) {
          this.auth1 = res.data.auth;
          this.auth3 = res.data.auth3;
          this.identity_type = res.data.identity_type;
          this.identity = res.data.identity;
          // 身份证审核状态
          if (res.data.identity_type == 4) {
            switch (res.data.auth) {
              case 0:
                this.identification_normal = "审核中";
                break;
              case 1:
                this.identification_normal = "已认证";
                break;
              case 2:
                this.identification_normal = "审核未通过";
                break;
              case 4:
                this.identification_normal = "未认证";
                break;
            }
          } else {
            //护照审核状态
            switch (res.data.auth3) {
              case 0:
                this.identification_normal = "审核中";
                break;
              case 1:
                this.identification_normal = "已认证";
                break;
              case 2:
                this.identification_normal = "审核未通过";
                break;
              case 4:
                this.identification_normal = "未认证";
                break;
            }
            console.log()

          }

          // 证件类型
          switch (res.data.identity_type) {
            case 1:
              this.identity_type = "港澳";
              break;
            case 2:
              this.identity_type = "台湾";
              break;
            case 3:
              this.identity_type = "护照";
              break;
            case 4:
              this.identity_type = "身份证";
              break;
          }
        } else {
          wx.showToast({
            title: res.message,
            icon: "none",
            duration: 2000,
            mask: true
          });
        }
      });
    },
    call_Service () {
      wx.showModal({
        title: "", //提示的标题,
        content: "拨打电话联系客服？", //提示的内容,
        showCancel: true, //是否显示取消按钮,
        cancelText: "取消", //取消按钮的文字，默认为取消，最多 4 个字符,
        cancelColor: "#000000", //取消按钮的文字颜色,
        confirmText: "确定", //确定按钮的文字，默认为取消，最多 4 个字符,
        confirmColor: "#3CC51F", //确定按钮的文字颜色,
        success: res => {
          if (res.confirm) {
            wx.makePhoneCall({ phoneNumber: "400-671-1314" });
          } else if (res.cancel) {
          }
        }
      });
    },
    to_normal () {
      if ((this.auth1 == 2 || this.auth1 == 4) && this.auth3 != 0) {
        // 未审核或者审核未通过
        wx.navigateTo({ url: "/pages/package_mine/identification_level1/main" });
      } else if (this.auth3 == 0) {
        wx.showToast({
          title: "您正在进行港澳台、外籍用户认证", //提示的内容,
          icon: "none", //图标,
          duration: 1500, //延迟时间,
          mask: false, //显示透明蒙层，防止触摸穿透,
          success: res => { }
        });
        return;
      } else {
        return;
      }
    },
    to_special () {
      if ((this.auth3 == 2 || this.auth3 == 4) && this.auth1 != 0) {
        // 未审核或者审核未通过
        wx.navigateTo({ url: "/pages/package_mine/identification_level2/main" });
      } else if (this.auth1 == 0) {
        wx.showToast({
          title: "您正在进行普通用户认证", //提示的内容,
          icon: "none", //图标,
          duration: 1500, //延迟时间,
          mask: false, //显示透明蒙层，防止触摸穿透,
          success: res => { }
        });
        return;
      } else {
        return;
      }
    }
  },

  onLoad () {
    wx.setNavigationBarTitle({
      title: "实名认证"
    });
    Object.assign(this.$data, this.$options.data());
    this.getData();
  },
  onShow () {
    this.getData();
  }
};
</script>

<style lang="less" scoped>
.container {
  width: 100%;
  height: 100%;
  background: rgba(243, 244, 246, 1);
  box-sizing: border-box;
  padding: 0 15px;
  .header {
    width: 345px;
    height: 126px;
    margin: 10px auto 0;
    .image {
      width: 100%;
      height: 100%;
    }
  }
  .list {
    width: 100%;
    margin-bottom: 10px;
    background-color: #fff;
    border-radius: 0px 0px 8px 8px;
    .item {
      width: 100%;
      height: 44px;
      position: relative;
      box-sizing: border-box;
      &.item:first-of-type {
        border-bottom: 1px solid rgba(243, 244, 246, 1);
      }
      a {
        display: block;
        width: 100%;
        height: 100%;
        line-height: 44px;
        padding-left: 15px;
        font-size: 14px;
        font-family: "Medium";
        font-weight: 500;
        color: rgba(51, 51, 51, 1);
        position: relative;
        box-sizing: border-box;
        &.clearfix1 {
          color: #666;
          height: 37px;
          line-height: 37px;
        }
        .status {
          font-size: 14px;
          font-family: "PingFangSC-Regular";
          font-weight: 400;
          color: #ff383e;
          float: right;
        }
        .img {
          width: 100%;
          height: 100%;
          display: block;
        }
        .gray {
          color: #333;
          margin-right: 15px;
        }
        .icon {
          width: 32px;
          height: 32px;
          display: block;
          float: right;
          margin-top: 6px;
          .img {
            width: 100%;
            height: 100%;
            display: block;
          }
        }
      }
      &:last-of-type {
        border-bottom: none;
      }
      .btn {
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        z-index: 10;
        opacity: 0;
      }
    }
  }
  .tip {
    margin-top: 15px;
    .tip1 {
      font-size: 12px;
      font-family: "Regular";
      color: rgba(136, 136, 136, 1);
      line-height: 20px;
      margin-bottom: 20px;
    }
    .tip2,
    .tip3,
    .tip4 {
      font-size: 12px;
      font-family: "PingFangSC-Regular";
      font-weight: 400;
      color: rgba(246, 70, 101, 1);
      line-height: 20px;
      margin-bottom: 6px;
    }
    .tip4 {
      margin-bottom: 15px;
    }
    .tip5,
    .tip6 {
      font-size: 12px;
      font-family: "PingFangSC-Regular";
      font-weight: 400;
      color: rgba(153, 153, 153, 1);
      line-height: 20px;
    }
  }
}
</style>
